<template>
	<view class="loginCon">
		<view class="bgImg">
			<image src="../../static/img/loginBG2.png"></image>
		</view>
		<view class="fromContral">
			<view class="fromInput">
				<input v-model="userData.schollNum" placeholder-style="color:#ffffff" class="uni-input username" placeholder="学号" />
			</view>
			<view class="fromInput">
				<input v-model="userData.password" placeholder-style="color:#ffffff" class="uni-input password" type="password" placeholder="旧密码" />
			</view>
			<view class="fromInput">
				<input v-model="userData.passwordNew" placeholder-style="color:#ffffff" class="uni-input password" type="password" placeholder="新密码" />
			</view>
				<button type="default" disabled="true" @touchend="editPass" class="loginBtn">确认修改</button>
			<radio-group @change="radioChange" 
			style="margin-top: 20rpx;color: #ffffff;"
			>
			    <label class="radio"><radio value="教师"/>教师</label>
			    <label class="radio"><radio value="学生"/>学生</label>
			</radio-group>
		</view>
	</view>
</template>

<script>
	import { editPass } from "../../network/users.js"
	export default {
		data() {
			return {
				userData:{
					schollNum:"",
					password:"",
					passwordNew:"",
					jiaoses:""
				}
			}
		},
		methods: {
			editPass(){
				if(this.userData.schollNum === ""){
					console.log("请输入学号");
					return;
				}
				if(this.userData.password === ""){
					console.log("请输入密码");
					return;
				}
				if(this.userData.jiaoses === ""){
					console.log("请选择角色");
					return;
				}
				editPass(this.userData).then(res=>{
					console.log(res);
				}).catch(err=>{
					console.log(err);
				})
			},
			
			radioChange(evt) {
				this.userData.jiaoses = evt.target.value
			}
		}
	}
</script>

<style>
	.bgImg{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: -1;
	}
	.bgImg image{
		width: 100%;
		height: 100%;
	}
	.fromContral{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		z-index: 999;
	}
	.fromInput{
		width:560rpx;
		padding: 20rpx;
		border-radius: 50rpx;
		border: 1px solid #FFFFFF;
		margin-top: 40rpx;
	}
	.fromInput:nth-child(1){
		background: #29b7a9;
	}
	.fromInput:nth-child(2){
		background: #29b7a9;
	}
	.uni-input{
		
	}
	.loginBtn{
		width:600rpx;
		height: 100rpx;
		line-height: 100rpx;
		border-radius: 50rpx;
		margin-top: 40rpx;
		background: #ffffff;
	}
</style>
